<template>
	<view class="lookover">
		<u-navbar :bgColor="bgColor" title="查看评价" :titleStyle="titleStyle" leftIconColor="#ffffff"
			:autoBack="true"></u-navbar>
		<view class="" :style="{'height':globalData.navHeight-10 +'px'}"></view>

		<view class="overContent">

			<view class="typeBox">
				<view class="title">
					是否为本房源
				</view>
				<view class="typeitem">
					{{pageData.is_housing == 1 ? "是" : "不是"}}
				</view>
			</view>

			<view class="typeBox" style="margin-top: 60rpx;">
				<view class="title">
					看房满意度
				</view>
				<view class="typeitem">
					{{pageData.satisfaction}}
				</view>
			</view>
			<view class="typeBox" style="margin-top: 60rpx;">
				<view class="title">
					其他
				</view>
				<view class="type satisfactionbox">
					<view class="typeitems" v-for="(item,index) in pageData.label">
						{{item.name}}
					</view>
				</view>

			</view>


			<view class="typeBox" style="margin-top: 60rpx;">
				<view class="title">
					评价内容
				</view>
				<view class="contenttext">
					{{pageData.content}}
				</view>
				<view class="" style="display: flex;flex-wrap: wrap;margin-top: 40rpx;">
					<image v-for="(item,index) in pageData.images" class="imgma" :src="item" style="width: 204rpx; height: 204rpx; border-radius: 20rpx;margin-right: 28rpx;
					margin-bottom: 28rpx;">
					</image>
				</view>

			</view>




		</view>

	</view>
</template>

<script>
	import {
		evaluateList
	} from "@/api/api.js"
	export default {
		data() {
			return {
				bgColor: "#F8AD22",
				titleStyle: {
					color: "#ffffff",
					fontSize: "32rpx",
					fontFamily: "PingFang SC-Bold, PingFang SC",
					fontweight: "bold",
				},
				globalData: {
					statusBarHeight: 0, // 状态导航栏高度
					navHeight: 0, // 总体高度
					navigationBarHeight: 0, // 导航栏高度(标题栏高度)
				},
				pageData: {},
			}
		},
		onLoad(options) {
			console.log("options", options.id)
			this.getevaluateList(options.id)
			this.getNavbarHeight()
		},
		methods: {
			async getevaluateList(id) {
				let res = await evaluateList({
					order_id: id
				})
				if (res.code == 1000) {
					// console.log("评价记录",res)
					this.pageData = res.data
					this.pageData.images = this.pageData.images.split(",")
					console.log("pageData.iiiiiii", this.pageData.images)
				}
			},
			getNavbarHeight() {
				// 状态栏高度
				this.globalData.statusBarHeight = uni.getSystemInfoSync().statusBarHeight

				// #ifdef MP-WEIXIN
				// 获取微信胶囊的位置信息 width,height,top,right,left,bottom
				const custom = wx.getMenuButtonBoundingClientRect()
				// console.log(custom)

				// 导航栏高度(标题栏高度) = 胶囊高度 + (顶部距离 - 状态栏高度) * 2
				this.globalData.navigationBarHeight = custom.height + (custom.top - this.globalData.statusBarHeight) * 2
				// console.log("导航栏高度："+this.globalData.navigationBarHeight)

				// 总体高度 = 状态栏高度 + 导航栏高度
				this.globalData.navHeight = this.globalData.navigationBarHeight + this.globalData.statusBarHeight

				// #endif

				console.log("高度", this.globalData)

			},
		}
	}
</script>

<style scoped lang="scss">
	.imgma:nth-child(3n) {
		margin-right: 0;
	}

	.overContent {
		width: 100%;
		background-color: #ffffff;
		padding: 50rpx 30rpx;
		box-sizing: border-box;

		.typeBox {
			.title {
				font-size: 28rpx;
				font-family: PingFang SC-Bold, PingFang SC;
				font-weight: bold;
				color: #333333;
				line-height: 33rpx;
			}

			.type {
				display: flex;
				flex-wrap: wrap;
				margin-top: 30rpx;
			}

			.typeitem {
				width: 146rpx;
				height: 56rpx;
				background: #F8AD22;
				border-radius: 200rpx 200rpx 200rpx 200rpx;
				text-align: center;
				line-height: 56rpx;
				font-size: 26rpx;
				font-family: PingFang SC-Regular, PingFang SC;
				font-weight: 400;
				color: #FFFFFF;
				margin-top: 30rpx;
			}

			.typeitems {
				// width: 146rpx;
				height: 56rpx;
				background: #CACACA;
				border-radius: 200rpx 200rpx 200rpx 200rpx;
				font-size: 26rpx;
				font-family: PingFang SC-Regular, PingFang SC;
				font-weight: 400;
				background: #F8AD22;
				color: #FFFFFF;
				line-height: 56rpx;
				text-align: center;
				margin-right: 10rpx;
				margin-bottom: 30rpx;
				padding: 0 10rpx;
			}

			.contenttext {
				font-size: 24rpx;
				font-family: PingFang SC-Regular, PingFang SC;
				font-weight: 400;
				color: #666666;
				line-height: 44rpx;
				margin-top: 20rpx;
			}
		}
	}
</style>